
<template>
  <div class="common-layout">
    <el-container>
      <el-aside width="200px" id="aside">
        <div class="title">
          <span>IWu招聘企业版</span>
        </div>
        <el-menu active-text-color="#409EFF" background-color="#545c64" class="el-menu-vertical-demo"
          default-active="ehome" text-color="#fff" @open="handleOpen" @close="handleClose">
          <el-menu-item index="ehome" route="/enterprisehome/ehome" @click="showHRHome()">
            <el-icon>
              <HomeFilled />
            </el-icon>
            <span>首页</span>
          </el-menu-item>
          <el-menu-item index="einfo" route="/enterprisehome/einfo" @click="showEInfo()">
            <el-icon>
              <OfficeBuilding />
            </el-icon>
            <span>公司信息</span>
          </el-menu-item>
          <el-sub-menu index="enterprisejobmanage">
            <template #title>
              <el-icon>
                <Grid />
              </el-icon>
              <span>岗位管理</span>
            </template>
            <el-menu-item index="ejobing" route="/enterprisehome/ejobing" @click="showEJobing()">在招岗位</el-menu-item>
            <el-menu-item index="ejobed" route="/enterprisehome/ejobed" @click="showEJobed()">停招岗位</el-menu-item>
          </el-sub-menu>
          <el-sub-menu index="enterpriseresumelog">
            <template #title>
              <el-icon>
                <Collection />
              </el-icon>
              <span>简历管理</span>
            </template>
            <el-menu-item index="eApplyReusme" route="/enterprisehome/eApplyReusme" @click="showEApplyResume()">求职简历
            </el-menu-item>
            <el-menu-item index="resumeAnalysis" route="/enterprisehome/resumeAnalysis" @click="showEResumeAnalysis()">简历分析
            </el-menu-item>
            <!-- <el-menu-item index="1-2">已通过的简历</el-menu-item> -->
          </el-sub-menu>
          <el-sub-menu index="myMessage">
            <template #title>
              <el-icon>
                <Bell />
              </el-icon>
              <span>我的消息</span>
            </template>
            <el-menu-item index="eInfoAuditResult" route="/enterprisehome/eInfoAuditResult"
              @click="showEInfoAuditResult()">公司信息审核
            </el-menu-item>
            <el-menu-item index="jobInfoAuditResult" route="/enterprisehome/jobInfoAuditResult"
              @click="showJobInfoAuditResult()">岗位信息审核
            </el-menu-item>

          </el-sub-menu>
          
        </el-menu>

      </el-aside>
      <el-container>
        <el-header id="head">
          <div class="h">
            <EHeader />
          </div>

        </el-header>
        <el-main id="main">
          <HRHome v-if="isShowHRHome" />
          <EnterpriseInfo v-if="isShowEInfo" />
          <Publishing v-if="isShowEJobing" />
          <Published v-if="isShowEJobed" />
          <ApplyResume v-if="isShowEApplyResume" />
          <EAuditResult v-if="isShowEInfoAuditResult" />
          <JobAuditResult v-if="isShowJobInfoAuditResult" />
          <EStatisticalChart v-if="isShowEResumeAnalysis" />
        </el-main>
        <el-footer id="foot">
          <div class="foot-p">
            欢迎你！Welcome You!
          </div>

        </el-footer>
      </el-container>
    </el-container>
  </div>
</template>

<script lang="ts" setup>
import { HomeFilled, Grid, Collection, OfficeBuilding, Bell } from '@element-plus/icons-vue'
import EHeader from "@/components/HeaderS.vue"
import EnterpriseInfo from "@/components/enterprise/EnterpriseInfo.vue"
import Publishing from "@/components/enterprise/Publishing.vue"
import Published from "@/components/enterprise/Published.vue"
import HRHome from "@/components/enterprise/HRHome.vue"
import ApplyResume from "@/components/enterprise/ApplyResume.vue"
import EAuditResult from "@/components/enterprise/EAuditResult.vue"
import JobAuditResult from "@/components/enterprise/JobAuditResult.vue"
import EStatisticalChart from "@/components/enterprise/EStatisticalChart.vue"

import { ref, onMounted, reactive, getCurrentInstance } from "vue"
import { useRoute } from 'vue-router'
import { useStore } from "vuex"

const handleOpen = (key: string, keyPath: string[]) => {
  
}
const handleClose = (key: string, keyPath: string[]) => {
  
}

const store = useStore()
// @ts-ignore
const { proxy } = getCurrentInstance() // 1.获取proxy实例
const route = useRoute()
const index = ref()


const isShowHRHome = ref(true)
const isShowEInfo = ref(false)
const isShowEJobing = ref(false)
const isShowEJobed = ref(false)
const isShowEApplyResume = ref(false)
const isShowEInfoAuditResult = ref(false)
const isShowJobInfoAuditResult = ref(false)
const isShowEResumeAnalysis = ref(false)

const showHRHome = () => {
  isShowHRHome.value = true
  isShowEInfo.value = false
  isShowEJobing.value = false
  isShowEJobed.value = false
  isShowEApplyResume.value = false
  isShowEInfoAuditResult.value = false
  isShowJobInfoAuditResult.value = false
  isShowEResumeAnalysis.value=false
}
const showEInfo = () => {
  isShowHRHome.value = false
  isShowEInfo.value = true
  isShowEJobing.value = false
  isShowEJobed.value = false
  isShowEApplyResume.value = false
  isShowEInfoAuditResult.value = false
  isShowJobInfoAuditResult.value = false
  isShowEResumeAnalysis.value=false
}
const showEJobing = () => {
  isShowHRHome.value = false
  isShowEInfo.value = false
  isShowEJobing.value = true
  isShowEJobed.value = false
  isShowEApplyResume.value = false
  isShowEInfoAuditResult.value = false
  isShowJobInfoAuditResult.value = false
  isShowEResumeAnalysis.value=false
}
const showEJobed = () => {
  isShowHRHome.value = false
  isShowEInfo.value = false
  isShowEJobing.value = false
  isShowEJobed.value = true
  isShowEApplyResume.value = false
  isShowEInfoAuditResult.value = false
  isShowJobInfoAuditResult.value = false
  isShowEResumeAnalysis.value=false
}
const showEApplyResume = () => {
  isShowHRHome.value = false
  isShowEInfo.value = false
  isShowEJobing.value = false
  isShowEJobed.value = false
  isShowEApplyResume.value = true
  isShowEInfoAuditResult.value = false
  isShowJobInfoAuditResult.value = false
  isShowEResumeAnalysis.value=false
}
const showEInfoAuditResult = () => {
  isShowHRHome.value = false
  isShowEInfo.value = false
  isShowEJobing.value = false
  isShowEJobed.value = false
  isShowEApplyResume.value = false
  isShowEInfoAuditResult.value = true
  isShowJobInfoAuditResult.value = false
  isShowEResumeAnalysis.value=false
}
const showJobInfoAuditResult = () => {
  isShowHRHome.value = false
  isShowEInfo.value = false
  isShowEJobing.value = false
  isShowEJobed.value = false
  isShowEApplyResume.value = false
  isShowEInfoAuditResult.value = false
  isShowJobInfoAuditResult.value = true
  isShowEResumeAnalysis.value=false
}
const showEResumeAnalysis=()=>{
  isShowHRHome.value = false
  isShowEInfo.value = false
  isShowEJobing.value = false
  isShowEJobed.value = false
  isShowEApplyResume.value = false
  isShowEInfoAuditResult.value = false
  isShowJobInfoAuditResult.value = false
  isShowEResumeAnalysis.value=true
}

onMounted(() => {

})

</script>

<style scoped>
.title {
  display: inline-flex;
  height: 60px;
  width: 200px;
  font-size: 24px;
  color: #FFF;
  align-items: center;
  justify-content: center;
  background-color: #3f4348;
}

.el-menu-vertical-demo {
  height: 100vh;
  border: 0;
}


#aside {
  background-color: #545c64;
  /* height: 100vh; */
  /* height: 1200px; */
}

.h {
  width: 1200px;
  min-width: 1200px;
}

#head {
 
  box-shadow: 0px 1px 2px rgba(213, 208, 213, 3);
  z-index: 11;

}

#main {
  /* height: 1200px; */
  background-color: rgb(240, 240, 240);
  min-width: 1280px;
}

.foot-p {
  width: 100%;
  height: 100%;
  min-width: 920px;
  display: flex;
  justify-content: center;
  align-items: center;
}

#foot {
  background-color: #FFF;
  color: rgb(75, 76, 77);
}

.common-layout {
  font-family: '微软雅黑';
}
</style>